<template>
	<div>
		<div class="main">班级管理</div>
		<div style="height: 3.875rem;line-height: 3.875rem;margin-left: 5%;margin-right: 5%;cursor: pointer;"><span @change="ChangeActive(1)">全部班级</span>
		<hr>
		</div>
		<ClassList :active="active"></ClassList>
	</div>


</template>

<script>
	import ClassList from "../../ClassList.vue"
	export default {
		components:{
			ClassList:ClassList
		},
		data() {
			return {
				active:1
			}
		},
		methods:{
			ChangeActive(val)
			{
				this.active=val;
			}
		}
	}
</script>

<style scoped="scoped" lang="scss">
	.main {
		width: 100%;
		height: 4.25rem;
		line-height: 4.25rem;
		font-size: 1.25rem;
		font-weight: 18.75;
		/* display: flex;
		justify-content: space-between; */
		color: white;
		text-align: center;
		cursor: pointer;
		background-color: #03d3bd;
	}

	.header1 button {
		margin-bottom: 1.875rem;
		margin-top: 0.625rem;
		height: 40px;
		width: 110px;
		outline: none;
		border: inherit;
		color: #3f3f3f;
		background-image: linear-gradient(to right, #03d3bd, #04dac4);
		color: white;
		border-radius: 40px;
		margin-left: 30px;
		cursor: pointer;
	}

	.header1 button:hover {
		background-image: linear-gradient(to right, #03d3bd, #04dac4);
		color: white;
	}

	.header1 button i {
		margin-right: 5px;
		font-weight: bold;
	}

	.header1 .el-input {
		position: absolute;
		right: 0;
		width: 200px;
		border-radius: 30px;
		margin-right: 50px;
	}
	
	/* 设置滚动条的样式 */
	::-webkit-scrollbar {
		width: 5px;
	}
	
	/* 滚动槽 */
	::-webkit-scrollbar-track {
		-webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3);
		border-radius: 5px;
	}
	
	/* 滚动条滑块 */
	::-webkit-scrollbar-thumb {
		border-radius: 10px;
		background: rgba(0, 0, 0, 0.1);
		-webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5);
	}
	
	::-webkit-scrollbar-thumb:window-inactive {
		background: rgba(236, 246, 255, 0.4);
	}
	
</style>
